import React from 'react'
import {useContext } from "react" // 以use开头的都叫hooks
import {demoContext} from "../utils/context"
import {useState,useEffect} from "react"
import axios from 'axios'
function Grandson() {
  let [arr,setArr] = useState([])  
  useEffect(()=>{
     axios({
         url:"/list",
         type:"get"
     }).then(res=>{
         console.log(res.data);
         setArr(res.data)
     })
  },[]) // 这个参数为空数组的时候代表着compoentDidmountd ，组件挂载结束的生命周期 ,mountd
  let contextValue = useContext(demoContext)
  console.log(contextValue);
  return (
    <div>
        {
            arr && arr.length ? arr.map((item,index)=>{
           
                return <div key={index}>
                    <span>{item.name}</span>
                    <img src={item.img} alt="" />
                </div>
            }):"暂无数据"
        }
    </div>
  )
}

export default Grandson